/*
	blog-list
*/
.blog-article {
	padding:1em;
	margin:0px;
	width: 100%;
	min-height:100px;
	background-color:rgba(255,255,255,0.95);
	color:#000;
	border-radius: 6px;
}
.blog-article:HOVER{
	background: #fffafa;
}

.blog-article-top {
	margin-top: 30px;
}

.blog-article .author {
	width: 100%;
}

.blog-article a {
	text-decoration: none;
}

.blog-article .author a {
	color: #000;
	font-weight: bold;
}

.blog-article .author img {
	width: 5%;
	border-radius: 50%;
}

.blog-article .author span {
	text-align: left;
}

.blog-article .author a.title {
	width: 100%;
	padding-left:10px;
	max-height: 40px;
	overflow: hidden;
	color: #000;
	font-size: 1.7em;
	font-weight: bold;
}
.blog-article .author a.title:hover{
	color: #3399FF;
}

.blog-article .content {
	min-height: 2em;
	overflow: hidden;
	font-size: 1.2em;
	/*color: #222;*/
}

.blog-article .content p {
	margin: 5px auto;
	max-height:80px;
}

.blog-article .content p img {
	max-height: 100px;
}

.blog-article .footer {
	width: 100%;
	height:3em;
	padding-top: 20px;
}

.blog-article .footer span {
	padding: 5px;
	/*color: #56565a;*/
	font-size: 0.9vw;
}

.blog-article .footer .footer-left {
	float: left;
	text-align: left;
	width: 40%;
}

.blog-article .footer .footer-right {
	text-align: right;
	float: left;
	width: 60%;
}

/*
rank-list
*/

.blog_article_recommend_ul{
	list-style: none;
	padding: 0px;
	margin: 0px;
}
.blog_article_recommend_ul li {
	margin-bottom: 0.5em;
	padding:0.2em;
	border-bottom: 1px dashed #efe4e4;
}
.blog_article_recommend_ul li:nth-child(1) span{
	background-color: red;
}
.blog_article_recommend_ul li:nth-child(2) span{
	background-color: #ED1267;
}
.blog_article_recommend_ul li:nth-child(3) span{
	background-color: #D14BE3;
}
.blog_article_recommend_ul li span{
	display: inline-block;
	background-color: #ccc;
	vertical-align: middle;
	width:25px;
	height:25px;
	line-height:25px;
	text-align:center;
	color: #fff;
	font-weight:bold;
	border-radius: 3px;
}
.blog_article_recommend_ul li a{
	margin-left: 0.5em;
	text-decoration: none;
	color: #fff;
}
.blog_article_recommend_ul li a:hover{
	color: #3399FF;
}
/*
blog-core
*/
.fh5co-narrow-content{
	color: #fff;
}
#lrs-blog-main{
	position: relative;
	padding-top: 20px;
	min-height: 600px;
	z-index: 999;
}
#lrs-blog-main #lrs-blog-main-left{
	width: 75%;
	float: left;
	padding-left:10px;
	padding-right:10px;
	padding-bottom:10px;
	border-left:1px dashed #fff;
	border-right:1px dashed #fff;
}
#lrs-blog-main #lrs-blog-main-left .page-box{
	width: 100%;
}
#lrs-blog-main #lrs-blog-main-left .page-box a.page{
	display:block;
	width: 20%;
	height: 3em;
	line-height:2em;
	padding:10px 20px;
	color:#228896;
	background-color: rgba(255,255,255,0.9);
	text-align: center;
	border-radius: 10px;
	margin: 20px auto ;
	font-size:1vw;
	font-weight: bold;
}
#lrs-blog-main #lrs-blog-main-left .page-box a.page:HOVER{
	color: #000;
}

#lrs-blog-main #lrs-blog-main-right{
	width: 25%;
	float: right;
	position:relative;
	padding: 0px 20px 20px 10px;
	display: none;
}
#lrs-blog-main #lrs-blog-main-right .blog-label-ul{
	color: #000;
	list-style: none;
	padding-left: 0px;
}
#lrs-blog-main #lrs-blog-main-right .blog-label-ul li:HOVER{
transform:scaleY(1.3);
}
#lrs-blog-main #lrs-blog-main-right .blog-label-ul li a:HOVER{
	color: #000;
}

@media screen and (min-width: 0px) and (max-width: 1200px){
	#lrs-blog-main #lrs-blog-main-left{
		width: 100%;
	}
	#lrs-blog-main #lrs-blog-main-right{
		display: none;
	}
}
@media screen and (min-width: 1201px) {
	
	#lrs-blog-main #lrs-blog-main-left{
		width: 70%;
	}
	#lrs-blog-main #lrs-blog-main-right{
		width: 30%;
		display:block;
	}
	#lrs-blog-main #lrs-blog-main-right .toc{
		width:30%;
	}
}
@media screen and (min-width: 1401px) {
	
	#lrs-blog-main #lrs-blog-main-left{
		width: 75%;
	}
	#lrs-blog-main #lrs-blog-main-right{
		width: 25%;
		display:block;
	}
	#lrs-blog-main #lrs-blog-main-right .toc{
		width:25%;
	}
}


.icon-sm{
	font-size: 10px;
}
.list-group-item{
	color: #000;
	cursor:pointer;
}
.nav-tabs > li{
	background-color: #333;
	font-weight: bold;
	width: 33.3%;
}
.nav-tabs > li > a {
  color: #fff;
  margin-right: 2px;
  line-height: 1.42857143;
  border: 1px solid transparent;
  border-radius: 4px 4px 0 0;
  font-size:0.8vw;
  padding: 5px 0px;
  text-align: center;
}
.nav-tabs > li > a:hover {
  border-color: #eee #eee #ddd;
}
.nav-tabs > li.active > a,
.nav-tabs > li.active > a:hover,
.nav-tabs > li.active > a:focus {
  color: #555;
  cursor: default;
  background-color: #fff;
  border: 1px solid #ddd;
  border-bottom-color: transparent;
}
.nav-tabs.nav-justified {
  width: 100%;
  border-bottom: 0;
}
.nav-tabs.nav-justified > li {
  float: none;
}
.nav-tabs.nav-justified > li > a {
  margin-bottom: 5px;
  text-align: center;
}

.blog-info {
	color: #5BC0DE;
}

.blog-success {
	color: #5cb85c;
}

.blog-warning {
	color: #f0ad4e;
}

.blog-primary {
	color: #337ab7;
}
.red {
	color: red;
}

.label-friend {
	background-color: #7171B2;
}

.green {
	color: green;
}

.blue {
	color: blue;
}
/*
leaveword
*/
/*
.leaveword-box textarea{
	width: 99%;
	overflow: auto;
	word-break: break-all;
	height: 10em;
	color: #000;
	font-size: 1em;
	resize: none;
	border: 0px;
	padding-left:10px;
}
.leaveword-box footer{
	padding-right: 15px;
	font-size: 2em;
}
.leaveword-box>footer>a>i.fa-smile-o{
	font-size: 1.5em;
	color: #fff;
}


#leaveWord-list .comment-box2{
	margin-top: 20px;
}
#leaveWord-list .comment-list-box{
	background-color: #111;
	margin-right: 20px;
	padding: 10px 5px 5px 20px;
}
#leaveWord-list .comment-list-box header{
	width: 6%;
	position: absolute;
}
#leaveWord-list .comment-list-box header img{
	width: 100%;
	border-radius: 50%;
	
}
#leaveWord-list .comment-list-box .comment-list-info{
	padding-left: 10%;
	font-size: 0.8em;
}
#leaveWord-list .comment-list-box .comment-list-info p{
	padding-bottom: 0px;
}
#leaveWord-list .comment-list-box .comment-list-info h3{
	font-size: 1em;
	font-weight: bold;
}
#leaveWord-list .comment-list-box .comment-list-info .comment-time {
	color: #DFDFE5;
}
#leaveWord-list .comment-list-box .comment-list-info .comment-time span,footer span{
	padding-right: 2em;
}
#leaveWordpage a{
	font-size: 1.5em;
}
*/

.panel{
	color: #000;
}
/*
	blog-detail
*/
.markdown-body h1,.markdown-body h2,.markdown-body h3,.markdown-body h4,.markdown-body h5{
	border-bottom:0px;
}
.editormd-preview-container blockquote, .editormd-html-preview blockquote {
  background: #eee;
}
.editormd-preview-theme-dark blockquote {
  color: #ddd;
  padding: 0.5em;
  background: #222;
  border-color: #333;
}
#lrs-blog-main #lrs-blog-main-right .skinUl{
	width: 20px;
	position: absolute;
	top: 0px;
	right: 20px;
	list-style: none;
	padding-left: 0px;
	display: none;
}
#lrs-blog-main #lrs-blog-main-right .skinUl li:nth-child(1){
	background-color: #000;
	color: #fff;
	padding-top: 1em;
	padding-bottom: 1em;
}
#lrs-blog-main #lrs-blog-main-right .skinUl li:nth-child(2){
	background-color: #fff;
	color: #000;
	padding-top: 1em;
	padding-bottom: 1em;
}

.detail-head{
	width: 100%;
}
.detail-head .detail-head-info{
	padding: 0px;
}
.detail-head .detail-head-info h2{
	margin:0px;
	padding-top:0px;
	padding-bottom: 10px;
}
.detail-head .detail-head-info .col-md-5,.detail-head .detail-head-info .col-md-2,.detail-head .detail-head-info .col-md-3{
	padding-left:0px;
	padding-right:5px;
}
.detail-head .detail-head-info span{
	padding:0px 1px;
}
.detail-head .detail-head-info span strong{
	color: #08ff08;
}

.detail-footer{
	padding: 0px 0px 20px 0px;
}
.detail-footer .copyright{
	padding-left:10px;
	border-left:5px solid #08ff08;
	background-color: rgba(0,0,0,0.3);
	min-height: 3em;
	line-height:3em;
	color: #fff;
	margin-bottom: 2em;
}
.detail-footer .copyright #blog-footer-share strong{
	float: left;
	padding-right: 5px;
	padding-bottom:10px;
	line-height: 2.2em;
}
.detail-footer .row{
	margin-right:0px;
	margin-left:0px;
	font-size: 1.2em;
}
.detail-footer .next-atc{
	text-align: left;
}
.detail-footer .next-atc a,.last-atc a{
	color: #228896;
	padding-left: 5px;
}
.detail-footer .next-atc a:HOVER,.last-atc a:HOVER{
	color: #fff;
}
.detail-footer a#praise,a#reward{
	display:block;
	width: 100%;
	height:40px;
	line-height:40px;
	text-align: center;
	background-color: red;
	color: #fff;
}
	.blog-top{
		display: block;
		position: fixed;
		bottom: 30px;
		right: 30px;
		width: 30px;
		height:100px;
		line-height: 24px;
		text-align: center;
		color: #fff;
		background: rgba(0,255,255,0.5);
	}
	/*回到顶部*/
	.blog-top:HOVER{
		background:transparent;
		-webkit-transition-duration: 0.1s;
	}
	.blog-top .topText{
		padding:5px 8px;
		line-height: 24px;
		text-align: center;
		color: #fff;
	}
	.blog-top img{
		width: 120px;
		position: fixed;
		right:-10px;
	}
	
	.snow-canvas {
		display: block;
		width: 100%;
		height: 100%;
		top: 0;
		left: 0;
		position: fixed;
		pointer-events: none;
	}
	
	
	/*
		手机适配
	*/
	@media screen and (min-width: 0px) and (max-width: 768px){
	/*blog.html 文章列表样式*/
	.blog-article{
		padding-top: 0.1em;
		padding-bottom: 0;
		height: auto;
	}
	.blog-article .author a.title {
		font-size: 1em;
	}
	.blog-article .author img {
		/*
		width: 15%;
		*/
		display: none;
	}
	.blog-article .content p {
		font-size: 0.9em;
		text-overflow: ellipsis;
	}
	.blog-article .footer{
		padding-top: 0px;
		height: 2.1em;
	}
	.blog-article .footer .footer-left{
		display: none;
		width: 0%;
	}
	.blog-article .footer .footer-right{
		width: 100%;
	}
	#lrs-blog-main #lrs-blog-main-left .page-box a.page{
		width: 90%;
	}
	
	.blog-top{
		display: none !important ;
	}
	
	/*虚线*/
	#lrs-blog-main #lrs-blog-main-left{
		border-left:0px dashed #fff;
		border-right:0px dashed #fff;
	}
	
	#lrs-blog-main #lrs-blog-main-left{
		width: 100%;
		padding: 0px;
	}
	#lrs-blog-main-left .detail-footer .col-xs-6{
	    padding-right:5px;
	    padding-left: 5px;
	}
	#lrs-blog-main #lrs-blog-main-right{
		width: 0%;
	}
	.comment-list-box .comment-list-info footer span{
		display: none;
	}
	
}

#lrs-blog-main-right .toc{
	position: fixed;
	width:25%;
}
#lrs-blog-main-right .toc h3{
	margin: 0px;
	padding: 0px;
}
#lrs-blog-main-right .left-col{
	position: fixed;
	margin-top: 550px;
	width: 20%;
}
#lrs-blog-main-right .left-col .col{
	display:block;
	width: 200px;
	height:40px;
	line-height:40px;
	margin:20px auto;
	text-align: center;
	background:#444;
	color:#fff;
	font-size: 1em;
	font-weight:bold;
	letter-spacing:0.5em;
	border-radius: 5px;
	overflow: hidden;
}
#lrs-blog-main-right .left-col .col .row *{
	text-align: center;
	cursor: pointer;
}
#lrs-blog-main-right .left-col .col .row #black-skin{
	background-color: black;
	
}
#lrs-blog-main-right .left-col .col .row #white-skin{
	background-color: white;
	color: black;
	margin: 0px;
}
#lrs-blog-main-right .left-col .bdsharebuttonbox{
	margin-top: -10px;
	position:relative;
	background:rgba(255,255,255,0.2);
	display: none;
}
#lrs-blog-main-right .left-col .bdsharebuttonbox em{
    display: block;
    border-width: 10px;
    position: absolute;
    top: -20px;
    left: 80px;
    border-style: solid dashed dashed;
    border-color: transparent transparent rgba(255,255,255,0.2) transparent;
    font-size: 0;
    line-height: 0;
    z-index: 99999;
}

#lrs-blog-main-right .left-col .bdsharebuttonbox a{
	margin-left: 25px;
}

@media screen and (min-height: 0px) and (max-height: 300px){
	.toc{
		display: none;
	}
	.ztree{
		max-height: 100px;
	}
	#lrs-blog-main-right .left-col{
		margin-top: -50px;
	}
}
@media screen and (min-height: 300px) and (max-height: 600px){
	.ztree{
		max-height: 200px;
	}
	#lrs-blog-main-right .left-col{
		margin-top: 250px;
	}
}
@media screen and (min-height: 600px) and (max-height: 800px){
	.ztree{
		max-height: 300px;
	}
	#lrs-blog-main-right .left-col{
		margin-top: 350px;
	}
}
@media screen and (min-height: 800px) {
	.ztree{
		max-height: 500px;
	}
	#lrs-blog-main-right .left-col{
		margin-top: 550px;
	}
}


/*加载动画*/
#loading{
	position: fixed;
    left: 0px;
    top: 0px;
    width: 100%;
    height: 100%;
    z-index: 2147483647;
    background: #222 url(/images/bg.png) repeat;
    color: #fff;
}
#loading p{
	width: 500px;
	margin: 10% auto;
	font-size: 2em;
}
.beat-char {
    line-height: 3.4em;
    position: relative;
	display: inline-block;
	background: transparent;

}

.rotate{
	transform:rotate(360deg) ;
	-ms-transform:rotate(360deg); 	/* IE 9 */
	-moz-transform:rotate(360deg); 	/* Firefox */
	-webkit-transform:rotate(360deg); /* Safari 和 Chrome */
	-o-transform:rotate(360deg);
	-webkit-transition-duration: 0.7s;

}